<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>HongTech科技-登录</title>
    <meta http-equiv="Expires" content="0">
	<meta http-equiv="Pragma" content="no-cache">
	<meta http-equiv="Cache-control" content="no-cache">
	<meta http-equiv="Cache" content="no-cache">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <link rel="stylesheet" th:href="@{/plugins/bootstrap/css/bootstrap.min.css}"/>
    <link rel="stylesheet" th:href="@{/plugins/font-awesome/font-awesome.min.css}"/>
    <link rel="stylesheet" th:href="@{/common/css/common.css}"/>
    <link rel="stylesheet" th:href="@{/common/css/login.css}"/>
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <a class="logo-a" th:href="@{/}"><img th:src="@{/img/logo.png}" alt="logo"></a>
        </div>
    </div>
</nav>
<div class="login-content">
    <div class="login-bg"></div>
    <div class="login-box">
        <form id="loginForm" class="login-form">
            <div class="login-title">用户登录</div>
            <div class="form-group">
                <input type="text" name="username" id="username" value="admin" class="form-control" placeholder="输入用户名" required>
            </div>
            <div class="form-group">
                <input name="password" type="password" id="password" value="admin123" class="form-control" placeholder="输入密码" required>
            </div>
            <div class="form-group">
                <div class="code-content">
                    <input type="text" name="validateCode" id="validateCode" class="form-control code-input" placeholder="输入验证码">
                </div>
                <img id="verificationCode" th:src="@{/verificationCode}" class="pointer code-img">
            </div>
            <div class="row">
                <div class="col-xs-12">
                    <button id="loginBtn" type="button" class="btn btn-info btn-block btn-flat">登录</button>
                </div>
            </div>
            <div class="mt-20">
                <a href="#">忘记密码？点击这里</a>
                <a th:href="@{/register}" style="float: right;">注册</a>
            </div>
        </form>
    </div>
</div>
<div class="copyright-light copyright-section">
    <p>Copyright © 2023. All rights reserved.</p>
</div>
<script th:inline="javascript"> var ctx = [[@{/}]]; </script>
<script th:src="@{/plugins/jquery/jquery.min.js}"></script>
<script th:src="@{/plugins/bootstrap/js/bootstrap.min.js}"></script>
<script th:src="@{/plugins/layer/layer.min.js}"></script>
<script th:src="@{/plugins/jquery-validation/jquery.validate.min.js}"></script>
<script th:src="@{/plugins/jquery-validation/messages_zh.min.js}"></script>
<script th:src="@{/common/js/core.js}"></script>
<script>
    $(function () {

        if(window.top!==window.self){alert('未登录或登录超时。请重新登录');window.top.location=window.location};

        $(".code-img").on('click', function () {
            $(this).attr('src', ctx + 'verificationCode?_' + new Date().getTime());
        });

        $("#loginBtn").on('click', function () {
            if (!$("#loginForm").validate().form()) {
                return;
            }
        	var username = $.common.trim($("input[name='username']").val());
            var password = $.common.trim($("input[name='password']").val());
            var validateCode = $("input[name='validateCode']").val();
            var rememberMe = $("input[name='rememberMe']").is(':checked');
            $.modal.loading("登录中...");
            $.ajax({
                type: "post",
                url: ctx + "login",
                data: {
                    "username": username,
                    "password": password,
                    "validateCode": validateCode,
                    "rememberMe": rememberMe
                },
                success: function (data) {
	                if (data.code == 0) {
	                	location.href = ctx + "index";
	                } else {
	                	$.modal.closeLoading();
	                    layer.msg(data.msg, { offset: '30%', time: 2000 });
	                    $("#verificationCode").click();
	                }
            	}
            });
        });

        $(document).keyup(function (event) {
            if (event.keyCode == 13) {
                $("#loginBtn").click();
            }
        });

        function validateRule() {
            var icon = "<i class='fa fa-times-circle'></i> ";
            $("#loginForm").validate({
                rules: {
                    username: {
                        required: true
                    },
                    password: {
                        required: true
                    }
                },
                messages: {
                    username: {
                        required: icon + "请输入您的用户名",
                    },
                    password: {
                        required: icon + "请输入您的密码",
                    }
                }
            })
        }
    });
</script>
</body>
</html>
